﻿<!DOCTYPE html>
<html lang="zxx">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Home</title>
<!--bootstrap Css-->
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
<!--ico font Css-->
<link href="assets/css/font-awesome.min.css" rel="stylesheet">
<!-- magnific-popup Css-->
<link href="assets/css/magnific-popup.css" rel="stylesheet">
<!--lineProgressbar Css-->
<link href="assets/css/jquery.lineProgressbar.css" rel="stylesheet">
<!--owl.carousel Css-->
<link href="assets/css/owl.carousel.css" rel="stylesheet">
<!--Slick Nav Css-->
<link href="assets/css/slicknav.min.css" rel="stylesheet">
<!--Animate Css-->
<link href="assets/css/animate.css" rel="stylesheet">
<!--Style Css-->
<link href="assets/css/style.css" rel="stylesheet">
<!--Responsive Css-->
<link href="assets/css/responsive.css" rel="stylesheet">
</head>
<body>
 <!--nav section start-->
<nav class="nav-area">
	<div class="container">
		<div class="row">
			<div class="col-md-10">
				<ul id="main-menu">
					<li><a href="#home">主页</a></li>
					<li><a href="#about">关于</a></li>
					<li><a href="#resume">回顾</a></li>
					<li><a href="#work">日常</a></li>
					<li><a href="#blog">动漫</a></li>
					<li><a href="#contact">联系方式</a></li>
				</ul>
			</div>
		</div>
	</div>
</nav>
   <!--nav section end-->
  <!--header section start-->
   <header class="header-area header-bg" id="home">
		<div class="header-inner">
				<span>欢迎</span>
				<h1>I Am 黄Sir</h1>
				<h6>不念过往，不畏将来 , 不畏岁月惊扰，平添忧愁</h6>
				<div class="scroll-down">
					<span></span>
				</div>
		</div>
   </header>
     <!--header section end-->
     <!--about section start-->
     <section class="about-area" id="about">
     	<div class="container">
     		<div class="row">
     			<div class="col-md-6">
     				<img src="assets/img/profile-pic.png" alt="profile picture">
     			</div>
     			<div class="col-md-6">
     				<div class="section-title inner">
						<h2>关于我</h2>
						<p>重生2024年，好赌的狗，酗酒的猫，生病的仓鼠和破碎的他，不再唯唯诺诺，选择重拳出击，彻底改变命运。</p>
					</div>
     				<ul>
     					<li><strong>姓名 :</strong> 黄Sir</li>
     					<li><strong>年龄 :</strong> 20</li>
     					<li><strong>地址 :</strong> 四川成都</li>
     					<li><strong>邮箱 :</strong> 652652@mihoyo.com</li>
     					<li><strong>联系电话 :</strong> 000-652652652</li>
     				</ul>
     				<a href="#" class="boxed-btn">支持博主</a>
     				<a href="#" class="boxed-btn">暂不支持</a>
					<li><a href="../index1.jsp">返回论坛</a></li>
     			</div>
     		</div>
     	</div>
     </section>
     <!--about section end-->
     <!--skill section start-->
     <section class="skill-section">
     	<div class="container">
			<div class="row">
     			<div class="col-md-6 col-md-offset-3 text-center">
     				<div class="section-title main">
						<h2>我的技能</h2>
						<p>开局抽到神级转世大礼包，什么？只有鼠标键盘和笔记本！？</p>
					</div>
     			</div>
     		</div>
     		<div class="row text-center">
     			<div class="col-md-3 col-sm-6">
     				<div id="circle-1"></div>
     				<h4 class="text-uppercase">JAVA</h4>
     			</div>
     			<div class="col-md-3 col-sm-6">
     				<div id="circle-2"></div>
     				<h4 class="text-uppercase">C++</h4>
     			</div>
     			<div class="col-md-3 col-sm-6">
     				<div id="circle-3"></div>
     				<h4 class="text-uppercase">Html</h4>
     			</div>
     			<div class="col-md-3 col-sm-6">
     				<div id="circle-4"></div>
     				<h4 class="text-uppercase">Css</h4>
     			</div>
     		</div>
     	</div>
     </section>
     <!--skill section end-->
     <!-- resome section start -->
     <section class="resome-area" id="resume">
     	<div class="container">
     		<div class="row">
     			<div class="col-md-6 col-md-offset-3 text-center">
     				<div class="section-title main">
						<h2>个人经历</h2>
						<p>得道者多助，失道者寡助
							能得先生相助，三生幸事
						</p>
					</div>
     			</div>
     		</div>
     		<div class="row">
     			<div class="col-md-6 col-sm-12">
     				<div class="education-details">
     					<div class="icon">
     						<i class="fa fa-briefcase"></i>
     					</div>
     					<div class="single-education-list">
     						<h4>小学</h4>
     						<span class="duration">2010-2016</span>
     						<p>总有人间一两风， 填我十万八千梦。</p>
     					</div>
     					<div class="single-education-list">
     						<h4>初中</h4>
     						<span class="duration">2016-2019</span>
     						<p>至此鲜花曾自己，纵马踏花向自由</p>
     					</div>
     					<div class="single-education-list">
     						<h4>高中</h4>
     						<span class="duration">2019-2022</span>
     						<p>云日明松雪，溪山进晚风</p>
     					</div>
     				</div>
     			</div>
     			<div class="col-md-6 col-sm-12">
     				<div class="working-details">
     					<div class="icon">
     						<i class="fa fa-book"></i>
     					</div>
     					<div class="single-education-list">
     						<h4>大一</h4>
     						<span class="duration">2022-2023</span>
     						<p>三更月 中庭恰照梨花雪</p>
     					</div>
     					<div class="single-education-list">
     						<h4>大二</h4>
     						<span class="duration">2023-2024</span>
     						<p>从别后，忆相逢。几回魂梦与君同。</p>
     					</div>
     					<div class="single-education-list">
     						<h4>大三</h4>
     						<span class="duration">2024-2025</span>
     						<p>愿许东风知我意，吹尽人间意难平</p>
     					</div>
     				</div>
     			</div>

     		</div>
     	</div>
     </section>
     <!-- resome section end -->

    <!--my team section start-->
    <section class="team-area">
    	<div class="container">
    		<div class="row">
     			<div class="col-md-6 col-md-offset-3 text-center">
     				<div class="section-title main">
						<h2>我的团队</h2>
						<p>纵有狂风拔地起，我亦乘风破万里</p>
					</div>
     			</div>
     		</div>
            <div class="row">
                <div class="col-md-3 col-sm-6">
                    <div class="single-team-box">
                            <div class="team-member-thumb">
                                <img src="assets/img/team-1.png" alt=" team member picture">
                            </div>
                            <div class="content">
                                <h4>黄sir</h4>
                                <span class="prosition">Web Designer</span>
                                <ul class="social-links">
                                    <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                    <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                    <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                    <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                </ul>
                            </div></div>
                    </div>
                    <div class="col-md-3 col-sm-6">
                        <div class="single-team-box">
                            <div class="team-member-thumb">
                                <img src="assets/img/team-2.png" alt=" team member picture">
                            </div>
                            <div class="content">
                                <h4>付sir</h4>
                                <span class="prosition">Web Designer</span>
                                <ul class="social-links">
                                    <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                    <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                    <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                    <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6">
                        <div class="single-team-box">
                            <div class="team-member-thumb">
                                <img src="assets/img/team-4.png" alt=" team member picture">
                            </div>
                            <div class="content">
                                <h4>陈sir</h4>
                                <span class="prosition">Web Designer</span>
                                <ul class="social-links">
                                    <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                    <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                    <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                    <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 col-sm-6">
                        <div class="single-team-box">
                            <div class="team-member-thumb">
                                <img src="assets/img/team-3.png" alt=" team member picture">
                            </div>
                            <div class="content">
                                <h4>芮sir</h4>
                                <span class="prosition">Web Designer</span>
                                <ul class="social-links">
                                    <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                    <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                    <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                    <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
            </div>
    	</div>
    </section>
    <!--my team section end-->
     <!--portfolio section start-->
     <section class="portfolio-area" id="work">
     	<div class="container">
     		<div class="row">
     			<div class="col-md-6 col-md-offset-3 text-center">
     				<div class="section-title main">
						<h2>关于我的学校</h2>
						<p>四川轻化工大学（Sichuan University of Science & Engineering），简称“川轻化”（SUSE），
							位于四川省自贡市和宜宾市，是四川省人民政府、国家国防科技工业局共建的公办全日制普通本科高校。</p>
					</div>
     			</div>
     		</div>
     		<div class="row">
     			<div class="col-md-12 text-center">
     				<ul class="porfolio-menu">
     					<li data-filter="*" class="active">ALL</li>
     					<li data-filter=".design">汇南校区</li>
     					<li data-filter=".development">宜宾校区</li>
     					<li data-filter=".photography">李白河校区</li>
     				</ul>
     			</div>
     			<div class="col-md-12 text-center">
     				<div class="portolio-masonary">
     					<div class="single-porfolio-item grid-size design">
     						<div class="img-thumb">
     						<img src="assets/img/portfolio-1.jpg" alt=" portfolio image ">
     							<div class="hover">
     								<div class="icon">
     									<a href="assets/img/portfolio-1.jpg" class="image-popup" title="Portfolio image">
     										<i class="fa fa-search-plus" aria-hidden="true"></i>
     									</a>
     								</div>
     								<div class="icon">
     									<i class="fa fa-link" aria-hidden="true"></i>
     								</div>
     							</div>
     						</div>
     					</div>
     					<div class="single-porfolio-item grid-size design">
     						<div class="img-thumb">
     						<img src="assets/img/portfolio-2.jpg" alt=" portfolio image ">
     							<div class="hover">
     								<div class="icon">
     									<a href="assets/img/portfolio-2.jpg" class="image-popup" title="Portfolio image">
     										<i class="fa fa-search-plus" aria-hidden="true"></i>
     									</a>
     								</div>
     								<div class="icon">
     									<i class="fa fa-link" aria-hidden="true"></i>
     								</div>
     							</div>
     						</div>
     					</div>
     					<div class="single-porfolio-item grid-size development">
     						<div class="img-thumb">
     						<img src="assets/img/portfolio-3.png" alt=" portfolio image ">
     							<div class="hover">
     								<div class="icon">
     									<a href="assets/img/portfolio-3.png" class="image-popup" title="Portfolio image">
     										<i class="fa fa-search-plus" aria-hidden="true"></i>
     									</a>
     								</div>
     								<div class="icon">
     									<i class="fa fa-link" aria-hidden="true"></i>
     								</div>
     							</div>
     						</div>
     					</div>
     					<div class="single-porfolio-item grid-size development ">
     						<div class="img-thumb">
     						<img src="assets/img/portfolio-4.png" alt=" portfolio image ">
     							<div class="hover">
     								<div class="icon">
     									<a href="assets/img/portfolio-4.png" class="image-popup" title="Portfolio image">
     										<i class="fa fa-search-plus" aria-hidden="true"></i>
     									</a>
     								</div>
     								<div class="icon">
     									<i class="fa fa-link" aria-hidden="true"></i>
     								</div>
     							</div>
     						</div>
     					</div>
     					<div class="single-porfolio-item grid-size photography">
     						<div class="img-thumb">
     						<img src="assets/img/portfolio-5.jpg" alt=" portfolio image ">
     							<div class="hover">
     								<div class="icon">
     									<a href="assets/img/portfolio-5.jpg" class="image-popup" title="Portfolio image">
     										<i class="fa fa-search-plus" aria-hidden="true"></i>
     									</a>
     								</div>
     								<div class="icon">
     									<i class="fa fa-link" aria-hidden="true"></i>
     								</div>
     							</div>
     						</div>
     					</div>
     					<div class="single-porfolio-item grid-size photography">
     						<div class="img-thumb">
     						<img src="assets/img/portfolio-6.png" alt=" portfolio image ">
     							<div class="hover">
     								<div class="icon">
     									<a href="assets/img/portfolio-5.jpg" class="image-popup" title="Portfolio image">
     										<i class="fa fa-search-plus" aria-hidden="true"></i>
     									</a>
     								</div>
     								<div class="icon">
     									<i class="fa fa-link" aria-hidden="true"></i>
     								</div>
     							</div>
     						</div>
     					</div>
     				</div>
     			</div>
     		</div>
     	</div>
     </section>
     <!--portfolio section end-->
     <!-- blog section start-->
     <section class="blog-area" id="blog">
     	<div class="container">
     		<div class="row">
     			<div class="col-md-6 col-md-offset-3 text-center">
     				<div class="section-title main">
						<h2>动漫</h2>
						<p>不是哥们，看动漫谁还看纯爱啊</p>
					</div>
     			</div>
     		</div>
     		<div class="row">
     			<div class="col-md-4 col-sm-6">
     				<div class="single-blog-post">
     					<div class="post-thumb">
     						<img src="assets/img/blog-1.jpg" alt=" blog image">
     					</div>
     					<h4>堀与宫村</h4>
     					<ul class="post-meta">
     						<li><i class="fa fa-clock-o"></i> 01 Jan 2021</li>
     						<li><i class="fa fa-user"></i> By <a href="#">CloverWorks</a></li>
     						<li><i class="fa fa-comments"></i> 9999+</li>
     					</ul>
     					<p>不论是谁，都会有不想被人知道的一面。在学校中漂亮大方、成绩优秀的人气女生堀，
							私下却打扮土气、忙于家务和照顾弟弟。在学校中是阴暗宅男形象的宫村
							，生活中却是打扮时尚、带耳钉的帅气男生。因为一次特别的相遇，两人开始有了交集。
							互相拥有对方秘密的两人，感情也在不断发酵。恋爱、友情，充满青春气息的超微碳酸系校园生活就此开始</p>
     					<a href="#" class="boxed-btn">了解更多</a>
     				</div>
     			</div>
     			<div class="col-md-4 col-sm-6">
     				<div class="single-blog-post">
     					<div class="post-thumb">
     						<img src="assets/img/blog-2.jpg" alt=" blog image">
     					</div>
     					<h4>不时轻声地以俄语遮羞的邻座艾莉同学</h4>
     					<ul class="post-meta">
							<li><i class="fa fa-clock-o"></i> 3 July 2024</li>
							<li><i class="fa fa-user"></i> By <a href="#">动画工房</a></li>
							<li><i class="fa fa-comments"></i> 9999+</li>
						</ul>
						<p>坐在久世政近邻桌的艾莉同学，看政近的目光总是很冷淡。然而她又时不时地用俄语向他表露心意。
							而这些话语从未被政近错过。原来，政近其实有着母语级别的俄语听力。
							艾莉同学对此一无所知，时不时地说着真心话。政近明明能听懂她的心意，
							却要装作听不懂。令人止不住嘴角上扬的恋爱故事究竟会如何发展。</p>
     					<a href="#" class="boxed-btn">了解更多</a>
     				</div>
     			</div>
     			<div class="col-md-4 col-sm-6">
     				<div class="single-blog-post">
     					<div class="post-thumb">
     						<img src="assets/img/blog-3.jpg" alt=" blog image">
     					</div>
     					<h4>伪恋</h4>
     					<ul class="post-meta">
							<li><i class="fa fa-clock-o"></i> 11 Jan 2014</li>
							<li><i class="fa fa-user"></i> By <a href="#">SHAFT</a></li>
							<li><i class="fa fa-comments"></i> 9999+</li>
						</ul>
						<p>一条乐，10年前，他和关系很好的某个女孩子做了一个约定，“下次见面的时候，我们就结婚吧”，分别时女孩送他的一条项链，10年来他一直都寸不离身地佩戴着。
							某一天，一条乐的班级里来了一位美少女转学生·桐崎千棘。
							从最初的相遇开始，一条乐和桐崎千棘就异常的合不来，不论什么事最后都会发展成吵架。
							在这“伪恋物语”的前方，究竟会有怎样的结局呢？</p>
     					<a href="#" class="boxed-btn">了解更多</a>
     				</div>
     			</div>
     		</div>
     	</div>
     </section>
     <!-- blog section end-->
     <!--contact section start-->
     <section class="contact-area" id="contact">	
		 <div class="container">
			<div class="row">
     			<div class="col-md-6 col-md-offset-3 text-center">
					<div class="section-title main">
							<h2>联系我们</h2>
							<p>作为咱就是说怎么个事小组的成员，请让我为你推荐我们的的博客空间</p>
					</div>
     			</div>
     		</div>
     		<div class="row">
     			<div class="col-md-4 col-sm-12">
     				<div class="single-contact-box">
     					<div class="icon">
     						<img src="assets/img/contact-icon-2.png" alt="contact icon">
     					</div>
     					<h4>邮箱</h4>
     					<p>652652@mihoyo.com</p>
     				</div>
     				<div class="single-contact-box">
     					<div class="icon">
     						<img src="assets/img/contact-icon-1.png" alt="contact icon">
     					</div>
     					<h4>地址</h4>
     					<p>四川宜宾</p>
     				</div>
     				<div class="single-contact-box">
     					<div class="icon">
     						<img src="assets/img/contact-icon-3.png" alt="contact icon">
     					</div>
     					<h4>电话</h4>
     					<p>+ 000-652652</p>
     				</div>
     			</div>
     			<div class="col-md-8 col-sm-12">
     				<div class="contact-form-wrapper">
     					<form action="index.html">
     						<div class="row">
     							<div class="col-md-6 col-sm-12">
     								<input type="text" placeholder="输入姓名">
     							</div>
     							<div class="col-md-6 col-sm-12">
     								<input type="email" placeholder="输入邮箱">
     							</div>
     							<div class="col-md-12">
     								<input type="text" placeholder="输入电话">
     								<textarea name="message" id="message" cols="30" rows="10" placeholder="请输入你的新闻信息"></textarea>
     								<input type="submit" value="确认发送" class="boxed-btn">
									<a href="../contact.jsp">返回论坛</a>
									<a href="../chatroom.jsp">进入聊天室</a>
     							</div>
     						</div>
     					</form>
     				</div>
     			</div>
     		</div>
		 </div>
     </section>
     <!--contact section end-->
     <!--footer area start-->
     <footer class="footer-area">
     	<div class="container">
     		<div class="row">
     			<div class="col-md-6 col-md-offset-3 text-center">
     				<ul class="social-area">
     					<li><a href="#"><i class="fa fa-facebook"></i></a></li>
     					<li><a href="#"><i class="fa fa-twitter"></i></a></li>
     					<li><a href="#"><i class="fa fa-instagram"></i></a></li>
     					<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
     					<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
     					<li><a href="#"><i class="fa fa-dribbble"></i></a></li>
     				</ul>
     				<div class="copyright-text">
						<p>HuangSir &copy; 2024.Company name 652QINGHUA <a target="_blank" href="https://www.suse.edu.cn/">652</a> </p>
     				</div>
     			</div>
     		</div>
     	</div>
     </footer>
     <!--footer area end-->
     <!--prealoader start-->
     <div class="preloader">
     	<div class="preloader-inner">
     		<div class="cssload-box-loading"></div>
     	</div>
     </div>
     <!--prealoader end-->
     <!--go to top start-->
     	<span class="go-top"><i class="fa fa-angle-double-up"></i></span>
    <!--go to top end-->
    <!--jquery script load-->
    <script src="assets/js/jquery.js"></script>
    <!--Isotope script load-->
    <script src="assets/js/isotope.pkgd.js"></script>
    <!-- magnific popup script load-->
    <script src="assets/js/jquery.magnific-popup.js"></script>
    <!--way point script load-->
    <script src="assets/js/waypoints.min.js"></script>
    <!--line progress bar script load-->
    <script src="assets/js/circle-progress.min.js"></script>
    <!-- counter up script load-->
    <script src="assets/js/typed.js"></script>
    <!-- typed script load-->
    <script src="assets/js/jquery.counterup.min.js"></script>
    <!--Owl carousel script load-->
    <script src="assets/js/owl.carousel.min.js"></script>
    <!--Image load script -->
    <script src="assets/js/imagesloaded.pkgd.js"></script>
    <!--Bootstrap v3 script load here-->
    <script src="assets/js/bootstrap.min.js"></script>
    <!--Slick Nav Js File Load-->
    <script src="assets/js/jquery.slicknav.min.js"></script>
    <!--Wow Js File Load-->
    <script src="assets/js/wow.min.js"></script>    
    <!--Wow Js File Load-->
    <script src="assets/js/scrollspy.js"></script>
    <!--Main js file load-->
    <script src="assets/js/main.js"></script>
</body>
</html>

